import 'dart:math';

import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart';
import 'package:flutter_demo/page/base_page_state.dart';

class NewsDetailPage extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return NewsDetailState();
  }
}

class NewsDetailState extends BasePageState<NewsDetailPage>
    with SingleTickerProviderStateMixin {
  TabController _tabController;
  @override
  void initState() {
    super.initState();
    appBarController.title = '详情';
    _tabController = TabController(
      length: 2,
      vsync: this,
    );
  }

  @override
  Widget buildBody(BuildContext context) {
    return NestedScrollView(
        headerSliverBuilder: (BuildContext context, bool innerBoxIsScrolled) {
          return <Widget>[
            _buildHeader(),
            _buildStickyTab(),
          ];
        },
        body: _buildBody());
  }

  Widget _buildHeader() {
    return SliverToBoxAdapter(
      child: Container(
        width: double.infinity,
        height: 250,
        child: CachedNetworkImage(
          imageUrl:
              "https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1584889996334&di=cd338c5220927652e8f071802620e5fd&imgtype=0&src=http%3A%2F%2Fa0.att.hudong.com%2F64%2F76%2F20300001349415131407760417677.jpg",
          height: double.infinity,
          fit: BoxFit.fill,
        ),
      ),
    );
  }

  Widget _buildStickyTab() {
    return SliverPersistentHeader(
      pinned: true,
      floating: true,
      delegate: _SliverPersistentTabDelegate(
          minHeight: 44,
          maxHeight: 44,
          child: Container(
              color: Colors.white,
              child: PreferredSize(
                  preferredSize: Size.fromHeight(44),
                  child: TabBar(
                    controller: _tabController,
                    labelColor: Theme.of(context).primaryColor,
                    unselectedLabelColor: Colors.black87,
                    indicatorSize: TabBarIndicatorSize.label,
                    indicatorWeight: 3,
                    tabs: <Widget>[
                      Tab(text: '详情'),
                      Tab(text: '评论'),
                    ],
                  )))),
    );
  }

  Widget _buildBody() {
//    return _tabController.index == 0 ? _buildContent() : _buildComment();
    return TabBarView(
      controller: _tabController,
      children: <Widget>[_buildContent(), _buildComment()],
    );
  }

  Widget _buildContent() {
    return SingleChildScrollView(
        child: Container(
      color: Colors.white,
      padding: EdgeInsets.all(15),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: <Widget>[
          Text(
            'Flutter跟其他混合开发模式比怎么样？',
            style: TextStyle(fontSize: 16, fontWeight: FontWeight.bold),
          ),
          Padding(
            padding: EdgeInsets.only(top: 5, bottom: 5),
            child: Text('这应该是每个程序猿选择新的领域的一种焦虑吧，其实我们可以根据自己的情况，'
                '以及该领域的发展前景来进行自己的判断。答案肯定不是唯一的。在塞班灭亡之前，'
                '没人可以那么肯定它就这样亡了。一个程序猿当然也不可能一辈子只是接触一个技术一个领域，'
                '学习难道不是作为程序猿来说的一种乐趣吗。对于前2个问题，我没法说出标准答案，'
                '第三个，有，咸鱼，爱奇艺，东方财富都在原生的基础上嵌入了Flutter。'),
          ),
          CachedNetworkImage(
            imageUrl:
                'https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=2534506313,1688529724&fm=26&gp=0.jpg',
          ),
          Padding(
            padding: EdgeInsets.only(top: 5, bottom: 5),
            child: Text('这应该是每个程序猿选择新的领域的一种焦虑吧，其实我们可以根据自己的情况，'
                '以及该领域的发展前景来进行自己的判断。答案肯定不是唯一的。在塞班灭亡之前，'
                '没人可以那么肯定它就这样亡了。一个程序猿当然也不可能一辈子只是接触一个技术一个领域，'
                '学习难道不是作为程序猿来说的一种乐趣吗。对于前2个问题，我没法说出标准答案，'
                '第三个，有，咸鱼，爱奇艺，东方财富都在原生的基础上嵌入了Flutter。'),
          ),
        ],
      ),
    ));
  }

  Widget _buildComment() {
    return ListView.separated(
        itemBuilder: _buildCommentItem,
        separatorBuilder: (BuildContext context, int index) {
          return Container(
            height: 0.5,
            color: Colors.black12,
          );
        },
        itemCount: 20);
  }

  Widget _buildCommentItem(BuildContext context, int index) {
    return Column(mainAxisAlignment: MainAxisAlignment.end, children: <Widget>[
      Container(
        color: Colors.white,
        padding: EdgeInsets.symmetric(vertical: 10, horizontal: 15),
        child: Row(
          children: <Widget>[
            CachedNetworkImage(
              imageUrl:
                  'https://ss1.bdstatic.com/70cFvXSh_Q1YnxGkpoWK1HF6hhy/it/u=2742633744,2774176871&fm=26&gp=0.jpg',
              width: 32,
              height: 32,
            ),
            Expanded(
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: <Widget>[
                  Padding(
                    child:
                        Text('你发的是个什么玩意你发的是个什么玩意你发的是个什么玩意你发的是个什么玩意你发的是个什么玩意'),
                    padding: EdgeInsets.only(left: 10),
                  )
                ],
              ),
            )
          ],
        ),
      ),
      Text('回复', style: TextStyle(color: Theme.of(context).primaryColor)),
      Container(
        height: 0.5,
        color: Colors.black12,
      )
    ]);
  }
}

class _SliverPersistentTabDelegate extends SliverPersistentHeaderDelegate {
  _SliverPersistentTabDelegate({
    @required this.minHeight,
    @required this.maxHeight,
    @required this.child,
  });

  final double minHeight;
  final double maxHeight;
  final Widget child;

  @override
  double get minExtent => minHeight;

  @override
  double get maxExtent => max(maxHeight, minHeight);

  @override
  Widget build(
      BuildContext context, double shrinkOffset, bool overlapsContent) {
    return new SizedBox.expand(child: child);
  }

  @override
  bool shouldRebuild(_SliverPersistentTabDelegate oldDelegate) {
    return maxHeight != oldDelegate.maxHeight ||
        minHeight != oldDelegate.minHeight ||
        child != oldDelegate.child;
  }
}
